
<#-- 导入模版定义文件-->
<#include "../template/template_editPage.ftl">
<@edit title="商品操作">
	<#if (product.id)??>
		<#assign isEdit = true />
	<#else>
		<#assign isAdd = true />
	</#if>
	<body class="input">
	<script type="text/javascript">
	$().ready( function() {
	
		var $validateErrorContainer = $("#validateErrorContainer");
		var $validateErrorLabelContainer = $("#validateErrorContainer ul");
		var $validateForm = $("#validateForm");
		var $tab = $("#tab");
	
		// Tab效果
		$tab.tabs(".tabContent", {
			tabs: "input"
		});
		
		// 表单验证
		$validateForm.validate({
			errorContainer: $validateErrorContainer,
			errorLabelContainer: $validateErrorLabelContainer,
			wrapper: "li",
			errorClass: "validateError",
			ignoreTitle: true,
			rules: {
				"faceValue": {
					required: true
				},
				"product.province": {
					required: true
				},
				"product.areaCity": {
					required: true
				},
				"product.operationCode": {
					required: true	
				}
			},
			messages: {
				"faceValue": {
					required: "请填写面值"
				},
				"product.province": {
					required: "请选择省"
				},
				"product.areaCity": {
					required: "请选择市"
				},
				"product.operationCode": {
					required: "请选择运营商"	
				}			
			},
			submitHandler: function(form) {
				$(form).find(":submit").attr("disabled", true);
				form.submit();
			}
		});
		<#if actionErrors??&&(actionErrors?size > 0)>
			$.dialog({type: "warn", content: "<#list errorMessages as list>${list}<br></#list>",
			 modal: true, autoCloseTime: 3000});
		</#if>
	});

	// 全选
	function checkedAll(nameid) {
	    $("input[name='product.areaCity']").attr("checked", true);
	}    	     
	</script>
		<div class="body">
			<div class="inputBar">
				<h1><span class="icon">&nbsp;</span><#if isAdd??>添加商品<#else>编辑商品</#if></h1>
			</div>
			<div style="display: none;" id="validateErrorContainer" class="validateErrorContainer">
				<div class="validateErrorTitle">以下信息填写有误,请重新填写</div>
				<ul></ul>
			</div>			
			<form id="validateForm" class="validate" method="post" action="<#if isAdd??>${web_base}/recharge/product!addProduct.htm<#else>${web_base}/recharge/product!editProduct.htm</#if>">
			<table class="inputTable tabContent">
			<tr>
				<th>商品名称:<input type="hidden" name="product.id" value="<#if isEdit??>${(product.id)!}</#if>" ></th>
				<td><#if isAdd??><input type="text" name="product.name" class="formText {required: true, username: true, remote:'product!checkName.htm', minlength: 2, maxlength: 200, messages: {required: '请输入商品名称!',remote: '商品名称已经存在!'}}" 
				    value=""><label class="requireField">*</label><#else>${(product.name)!}<input type="hidden" name="product.name" 
				    value="${(product.name)!}" /></#if></td>				
			</tr>
			<tr>
				<th>面值:</th>
				<td>
				<#if faceValue??>
					<#list faceValue as entry>
					<lable><input type="checkbox" id="faceValue${(entry)}" name="faceValue" value="${(entry)!}" />${money((entry)!)}</lable>
					</#list>
				</#if>
			</tr>
			<tr>
				<th>区域:</th>
				<td>
			        <span>省:</span><select style="width:70px" id="province" name="product.province" onchange=""></select>
			        <span id="areaCity"></span>
				</td>
			</tr>
			<tr>
				<th>运营商:</th>
				<td><select name="product.operationCode">
				<option value="">请选择运营商</option>
				<#if product??&&product.operationList??>
				<#list product.operationList as row>
				<option value="${(row.code)!}" <#if isEdit??><#if product.operationCode??&&product.operationCode=="${(row.code)!}" >selected="selected"</#if></#if>>${(row.name)!}</option>
				</#list>
				</#if>
				</select><label class="requireField">*</label></td>
			</tr>
			<tr>
				<th>号码类型:</th>
				<td><select name="product.phoneType">
				<#if phoneTypeList??>
				<#list phoneTypeList as row>
				<option value="${(row.code)!}" <#if isEdit??><#if product.phoneType??&&product.phoneType=="${(row.code)!}" >selected="selected"</#if></#if>>${(row.name)!}</option>
				</#list>
				</#if>
				</select></td>
			</tr>					
			<tr>
				<th>是否启用:</th>
				<td><select name="product.enable">
				    <option value="true"  <#if isEdit??><#if product.enable?default(true)?string('true','false')=="true">selected="selected"</#if></#if> >是</option>
				    <option value="false" <#if isEdit??><#if product.enable?default(true)?string('true','false')=="false">selected="selected"</#if></#if> >否</option>
				    </select>
				</td>
			</tr>
			<tr style="display:none">
				<th>是否可以修改:</th>
				<td><select name="product.enableChange">
					<option value="true"  <#if isEdit??><#if product.enableChange?default(true)?string('true','false')=="true">selected="selected"</#if></#if> >是</option>
				    <option value="false" <#if isEdit??><#if product.enableChange?default(true)?string('true','false')=="false">selected="selected"</#if></#if> >否</option>
				    </select>
				</td>
			</tr>
			<tr>
				<th>介绍:</th>
				<td><textarea class="formText" name="product.introduce">${(product.introduce)!}</textarea></td>
			</tr>			
			</table>
			<div class="buttonArea">
				<input type="submit" class="formButton" value="<#if isAdd??>添加<#else>修改</#if>" hidefocus="true" />&nbsp;&nbsp;&nbsp;&nbsp;
				<input type="button" class="formButton" onclick="window.history.back(); return false;" value="返  回" hidefocus="true" />
			</div>
			</form>
		</div>
<script type="text/javascript">
    $(document).ready(function () {
        $('#province').change(function () {
            var proviceCode = $('#province').val();
            loadArea(proviceCode, 'areaCity', '2', true);
        });
        loadArea('', 'province', '1', true);
        <#if (product.province)??> 
        	loadArea('${(product.province)!}', 'areaCity', '2', true); 
        </#if>
        <#if (product.faceValueList)??> 
	        faceValue = ${(product.faceValueList)!};
			var i;
			for (i = 0; i < faceValue.length; i++) {
				if (faceValue[i] != "")
				$("#faceValue"+ faceValue[i]).attr("checked",true);//选中的值 
			}        
        </#if>
    });
    function loadArea(parentCode, id, grade, isTip) {
       if (parentCode == undefined) {
            parentCode = '';
        }
        if (grade == undefined) {
            grade = '';
        }
        if (parentCode == '' && grade == '') {
            return;
        }
        $.ajax({
            type:"POST",
            url:"${web_base}/recharge/area!loadArea.htm",
            async:false,
            data:"parentCode=" + parentCode + '&grade=' + grade,
            success:function (data) {
             if (data != undefined && data != null && data != '') {
                var dataObj = eval('(' + data + ')');
                var html = '';
                var area ='';
                var chkHtml='';
                if (isTip) {
                    html = '<option value="">--请选择--</option>';
                }
                $.each(dataObj, function (i, n) {
                    if(n.grade==1)
                    	html = html + '<option value="' + n.code + '" >' + n.areaName + '</option>';
                    if(n.grade==2)
                        chkHtml = chkHtml + '<input type="checkbox" id="areaCity' + n.code + '" name="product.areaCity" value="' + n.code + '" >' + n.areaName + '</input>';
                });
                if(id=="province"){
                    $("#province").html(html);
                <#if (product.province)??>
                if ($.browser.msie && $.browser.version == "6.0") {
	                setTimeout(function () {
	                     $("#province").attr("value",'${(product.province)!}');
	                }, 1);                    
                }else{
                    $("#province").attr("value",'${(product.province)!}');
                }
                </#if>                    
                	}
                if(id=="areaCity"){
                	 $("#areaCity").html("<span>市:</span><input id='btnCheckAll' type='button' value='全选' onclick='checkedAll()' />"+chkHtml);
                <#if (product.areaCity)??>
                 	area = ${(product.areaCity)!};
				    var i;
				    for (i = 0; i < area.length; i++) {
				        if (area[i] != "")
				            $("#areaCity"+ area[i]).attr("checked",true);//选中的值 
				    }
                </#if>                	 
                	 }
                }
            }
        });
    }
</script>
	</body>

</@edit>